<template>
    <div class="searchText">
        <input type="search" name="" id="" placeholder="搜索课程" v-model='value'>
        <a href="search.html?keyword=&subjectId=&type=&courseType=">
            <button>
                <img src="../images/搜索.png" alt="" style="margin-right: 4px;">
                <span>搜索</span></button></a>
    </div>
</template>

<script>
    export default {
        name: "Search",
        data(){
            return{
                value: '',
            }
        }
    }
</script>

<style scoped>
    .searched{
        position: absolute;
        left: 8px;
        bottom: 0px;
        width: 16px;
        height: 2px;
        background-color: #00cf8c;
    }
    /* 搜索 */
    .searchText{
        float: left;
    }
    .headerTop input{
        font-size: 16px;
        line-height: 19px;
        float: left;
        width: 317px;
        height: 38px;
        border-radius: 19px 0 0 19px;
        padding: 6px 11px;
        outline: none;
        outline-color: #00cf8c;
        box-sizing: border-box;
        border: 1px solid #ddd;
    }
    .headerTop button{
        float: left;
        font-size: 16px;
        line-height: 19px;
        box-sizing: border-box;
        background-color: #00cf8c;
        outline: none ;
        border: none;
        padding: 0 15px;
        width: 83px;
        height: 38px;
        border-radius: 0 19px 19px 0;
        color: white;
    }

</style>